Text inside <p> shrinks on mobile devices while div does not [migrated]

Posted by guisasso on Pro Webmasters See other posts from Pro Webmasters or by guisasso
Published on 2013-06-26T19:49:47Z Indexed on 2013/06/26 22:30 UTC
Read the original article Hit count: 783

Filed under:

mobile

|

browsers

I asked this question on stack overflow, but didn't get any answers, so I'm trying here.

Does anybody know whats happening here? I tested on opera, dolphin and the factory android browser. (although it seems now to be working on opera)

The div doesn't change size, but the text somehow is shrunk to fit on part of a div. Anyway to prevent this?

Just to be clear, I'm trying to achieve on the mobile browser the same look as the pc version.

As the problem seems to be with the browsers, how can I force the text to take the full width of the div? I tried setting the p tag to 100% with no success.

The div has to have that width and be aligned to the left of the page.

enter image description here

On a Pc, as it should be:

enter image description here

I shrunk the code as much as I could:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-us">
<head>

<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />

<meta content="" name="keywords" />
<meta content="" name="description" />

<title></title>

</head>
<body>
<div style="width:1000px; margin-left:auto; margin-right:auto;" >

                            <div style="float:left; width:758px; background-color:aqua;">
                                <p>

                                Random text Random text Random text Random text Random text Random text Random text Random text 
                                Random text Random text Random text Random text Random text Random text Random text Random text 
                                Random text Random text Random text Random text Random text Random text Random text Random text  
                                Random text Random text Random text Random text Random text Random text Random text Random text  
                                Random text Random text Random text Random text Random text Random text Random text Random text  
                                Random text Random text Random text Random text Random text Random text Random text Random text  
                                Random text Random text .<br />
                                <br />
                                Random text Random text Random text Random text Random text Random text Random text Random text  
                                Random text Random text Random text .<br />
                                <br />
                                Random text Random text Random text Random text  <a href="http://www.a.com/a.html">
                                Random text </a> Random text  
                                Random text .
                                </p>
                            </div>
</div>
</body>
</html>

Thanks.

Developer IT